<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity4" >
<head>
    <div th:include="public/index_public :: head('文章详情')"></div>
    <link rel="shortcut icon" th:href="@{/image/urlImg/ahlib-erro5-001.ico}" type="image/x-icon">
    <!--    导入图标-->
    <link th:href="@{/css/font-img.css}" rel="stylesheet">
    <!--    站点图标-->

</head>

<style>
    .article {
        padding: 40px;
        border: #E5E5E5 1px solid;
        margin-bottom: 40px;
    }
    .detail-h2 {
        color: #3666C8;
        font-size: 25px;
        text-align: center;
        margin: 35px 0 20px;
    }
    .detail_t {
        text-align: center;
        color: #999;
        font-size: 16px;
        margin: 15px 0;
    }
    .detail-content_txt {
        margin: 0 -20px;
        border-top: 1px solid #eee;
        margin-top: 30px;
        padding-top: 30px;
        font-size: 16px;
        line-height: 28px;
    }
    .author {
        text-align: right;
        margin-top: 20px;
        margin-bottom: 20px;
        font-size: 14px;
    }
    /*分享*/
    .share-left {
        /*width: 60px;*/
        left: 220px;
        /*top: 10px;*/
        position: fixed;
    }
    .share-f {
        padding-left: 5px;
        font-size: 18px;
        color: #999;
    }
    .bshare-custom a{
        display: block;
        font-size: 45px;
        color: #A6B5D2;
        cursor: pointer;
    }
    .like-box a {
        position: relative;
        display: block;
        font-size: 45px;
        cursor: pointer;
    }
    .like-total{
        position: absolute;
        top: 10%;
        left: 70%;
        padding: 0px 5px;
        font-size: 12px;
        color: #fff;
        text-align: center;
        border-radius: 12px;
        background: #E13434;
        min-width: 20px;
    }
    .comment-total {
        position: absolute;
        top: 10%;
        left: 75%;
        padding: 0px 5px;
        font-size: 12px;
        color: #fff;
        text-align: center;
        border-radius: 12px;
        background: #E7AD00;
        min-width: 20px;
    }
    img {
        max-width: 100%;
        height: auto;
    }
</style>

<body>


<div class="layui-layout layui-layout-admin" id="gotop">
    <!--头部导航-->
    <div th:replace="public/index_public :: headNav"></div>
    <!--左侧导航-->
    <div th:replace="public/index_public :: leftNav"></div>


    <div class="layui-body">
        <!-- 内容主体区域 -->
        <div style="padding: 15px;">

            <div class="row">
                <div class="col-md-1">
                    <div class="share-left">
                        <a class="nav-link iconfont icon-fanhui" href="javascript:history.go(-1)" style=""></a>
                        <div class="share-f ">分享</div>
                        <div class="bshare-custom">
                            <a class="iconfont icon-weibo" style="color: #A6B5D2;"></a>
                            <a class="iconfont icon-qq" style="color: #A6B5D2;"></a>
                            <a class="iconfont icon-weixin-copy" style="color: #A6B5D2;"></a>
                        </div>
                        <div class="like-box">
                            <a class="iconfont icon-dianzan1" style="color: #A6B5D2;">
                                <span class="like-total">58</span>
                            </a>
                            <a href="#commentbox" class="iconfont icon-pinglun" th:if="${article.articleComment}==0" style="color: #A6B5D2;">

                                <span class="comment-total" th:text="${article.comments.size()}">1</span>

                            </a>
                        </div>
                    </div>
                </div>
                <div class="col-md-8">
                    <div class="article">
                        <h2 class="detail-h2" th:text="${article.articleTitle}">标题</h2>
                        <div class="detail_t">
                            <span th:if="${article.articleType}==0">原创</span>
                            <span th:if="${article.articleType}==1">转载</span>
                            <span th:text="${#dates.format(article.articleNewstime,'yyyy/MM/dd HH:mm')}">2020/6/19</span>
                            <span th:text="'作者:'+${article.articleAuthor}">李华</span>
                        </div>
                        <div class="detail-content_txt" th:utext="${article.articleContent}"></div>
                        <div class="author" th:text="'编辑:'+${article.articleEdit}"></div>
                    </div>

                    <div th:if="${article.articleComment}==0">
                        <div  th:replace="public/index_public :: comment(${article})"></div>
                    </div>
                </div>
                <div class="col-md-3">
                    <div style="background-color: #1c94c4">

                    </div>
                </div>
            </div>

        </div>
    </div>

    <!--    底部导航-->
    <div th:replace="public/index_public :: bottomNav"></div>

</div>
</body>
</html>